import React, { useState } from 'react'
import { useSelector } from 'react-redux'
import { Navigate, useNavigate } from 'react-router-dom';
import { Button } from 'react-vant'
import { Uploader, UploaderFileListItem, Cell } from 'react-vant';
type Props = {}

const Index = (props: Props) => {
	const user = useSelector((state: any) => state.userReducer.user)
	const [value, setValue] = useState<UploaderFileListItem[]>([]);
	const navigate = useNavigate()
	return (
		<div>
			{
				user.isLogin
					?
					(
						<div >
							<div style={{ display: 'flex' }}>
								<h1>{user.username}</h1>
								{/* 上传 */}
								<Uploader
									onClickPreview={(items, detail) => {
										console.log(items, detail);
									}}
									onClickUpload={() => {
										console.log('click upload tigger');
									}}
									value={value}
									onChange={setValue}
								/>
							</div>


							<div>
								<Cell title="我的信息" isLink />
								<Cell title="历史记录" isLink value="内容" onClick={ () => navigate('/user/history') }/>
								<Cell title="设置" isLink  value="内容" />
							</div>
						</div>
					)
					:
					(
						<>
							<Button block type='primary' onClick={() => navigate('/signup')}>未登录，请登录！</Button>
						</>
					)
			}
		</div>
	)
}

export default Index